<template>

  <div class="tools-div">
    <el-button type="success" size="small" @click="addShow">添 加</el-button>
  </div>
  <!-- 添加和删除弹出框  -->
  <el-dialog v-model="dialogVisible" title="添加或修改" width="30%">
    <el-form label-width="120px">
      <el-form-item label="活动标题">
        <el-input v-model="brand.acticityTitle" />
      </el-form-item>
      <el-form-item label="活动名称">
        <el-input v-model="brand.activityName" />
      </el-form-item>

<!--      <el-form-item label="活动图片">-->
<!--        <el-upload-->
<!--            class="avatar-uploader"-->
<!--            action="http://localhost:9999/admin/system/fileUpload"-->
<!--            :show-file-list="false"-->
<!--            :on-success="handleAvatarSuccess"-->
<!--            :headers="headers"-->
<!--        >-->
<!--          <img-->
<!--              v-if="brand.imgs"-->
<!--              :src="brand.imgs"-->
<!--              style="width: 200px; height: 200px;"-->
<!--          />-->
<!--          <el-icon v-else class="avatar-uploader-icon">-->
<!--            <Plus />-->
<!--          </el-icon>-->
<!--        </el-upload>-->
<!--      </el-form-item>-->

      <el-form-item label="活动信息">
        <el-input v-model="brand.remark" />
      </el-form-item>
      <el-form-item label="活动数量">
        <el-input v-model="brand.acnum" />
      </el-form-item>
      <el-form-item label="优惠卷价格">
        <el-input v-model="brand.acticityMony" />
      </el-form-item>
<!--      <el-form-item label="起始时间">-->
<!--        <el-date-picker-->
<!--            v-model="brand.startTime"-->
<!--            type="date"-->
<!--            :disabled-date="disabledDate"-->
<!--            value-format="YYYY-MM-DD"-->
<!--            :shortcuts="shortcuts"-->
<!--            :size="size"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="结束时间">-->
<!--        <el-date-picker-->
<!--            v-model="brand.endTime"-->
<!--            type="date"-->
<!--            :disabled-date="disabledDate"-->
<!--            value-format="YYYY-MM-DD"-->
<!--            :shortcuts="shortcuts"-->
<!--            :size="size"-->
<!--        />-->
<!--      </el-form-item>-->

      <el-form-item>
        <el-button type="primary" @click="saveOrUpdate">提交</el-button>
        <el-button @click="dialogVisible = false">取消</el-button>
      </el-form-item>
    </el-form>
  </el-dialog>

  <el-table :data="list" style="width: 100%">
    <el-table-column prop="uid" label="用户id" />
    <el-table-column prop="nickname" label="用户昵称" />
    <el-table-column prop="phone" label="手机号" />
    <el-table-column prop="sex" label="性别" />
    <el-table-column prop="cardName" label="真实姓名" />
    <el-table-column prop="cardId" label="身份证号" />
    <el-table-column prop="status" label="实名状态" />
    <el-table-column prop="deposit" label="押金状态" />
    <el-table-column label="操作" align="center" #default="scope">
      <el-button type="primary" size="small" @click="editShow(scope.row)">
        修改
      </el-button>
      <el-button type="danger" size="small" @click="remove(scope.row.id)">
        删除
      </el-button>
    </el-table-column>
  </el-table>

  <el-pagination
    v-model:current-page="pageParamsForm.page"
    v-model:page-size="pageParamsForm.limit"
    :page-sizes="[2, 4, 6, 8]"
    layout="total, sizes, prev, pager, next"
    :total="total"
    @size-change="handleSizeChange"
    @current-change="handleCurrentChange"
  />
</template>
<script setup>
import { onMounted, ref } from 'vue'
import { getUserList } from '@/api/user'
import { zhuangT } from '@/api/zhuangT.js'
// 分页条件查询
const list = ref([])
const total = ref('')
const pageParamsForm = ref({
  page: 1,
  size: 3,
  map: {
    uid: '',
    nickname: '',
    phone: '',
    sex: '',
    cardName: '',
    cardId: '',
    status: '',
   deposit:''
  },
})

onMounted(() => {
  fetchData()
})
const handleSizeChange = size => {
  pageParamsForm.value.size = size
  fetchData()
}
const handleCurrentChange = number => {
  pageParamsForm.value.page = number
  fetchData()
}

// 分页查询
const fetchData = async () => {
  const { data } = await getUserList(pageParamsForm.value)
  console.log(data)
  list.value = data.list
  total.value = data.total
}
// 押金状态
const depositStatus = ref(false)
const fetchDepositStatus = async () => {
  // codeMessage.value="已缴纳"
  const { data } = await zhuangT()
  console.log(data)
  if (data.code == 200) {
    depositStatus.value = true
  } else {
    depositStatus.value = false
  }
}

onMounted(() => {
  fetchDepositStatus()
})
</script>
